import React, {useContext, useEffect, useState} from "react";
import './Vote.less';
import VoteMain from './VoteMain';
import VoteFooter from './VoteFooter';
import {connect} from "react-redux";
// import {connect} from "./myReactRedux";

const Vote = function (props) {
    let {supNum,oppNum} = props
    console.log(props,'state.vote')
    return <div className="vote-box">
        <div className="header">
            <h2 className="title">React是很棒的前端框架</h2>
            <span className="num">{supNum + oppNum}</span>
        </div>
        <VoteMain/>
        <VoteFooter/>
    </div>;
};

export default connect(state => state.vote)(Vote);

/*
*   connect(mapStateToProps , mapDispatchToPrps)(我们要渲染的组件)
*       1.mapStateToProps：获取到 redux 中的公共状态
*           + connect(state =>{
*                // 存储 redux 容器中，所有模块的公共状态信息
*                // 返回对象中的信息，就是要作为属性，传递给组件的信息
*                return {
*                    supNum:state.vote.supNum
*                    info:state.person.info
*                    ...
*                }
*            })
*       2.mapDispatchToPrps：把需要派发的任务，当作属性传递给组件
*
* */
